﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Main.aspx.cs" Inherits="ABC.HRMS.Main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>人力资源管理系统</title>
    <link type="text/css" href="CSS/jquery-ui/jquery-ui-1.9.1.custom.min.css" rel="stylesheet" />
    <script type="text/javascript" src="JavaScript/jquery-1.8.2.min.js"></script>
	<script type="text/javascript" src="JavaScript/jquery-ui-1.9.1.custom.min.js"></script>
    <script type="text/javascript" src="JavaScript/jquery.jlayout.js"></script>
    <script type="text/javascript">
        $(function () {
            /* begin jquery layout init */
            var container = $('.layout');
            function relayout() {
                container.layout({ resize: false });
            }
            relayout();
            $(window).resize(relayout);

            $('#switchwest').click(function () {
                $('.west').animate({ width: 'toggle' }, { duration: 500, complete: relayout, step: relayout });
            });
            /* end jquery layout init */

            /* begin jquery ui init */
            $("#accordion").accordion({
                header: "h1",
                heightStyle: "content",
                collapsible: true
                //icons: { "header": "ui-icon-plus", "headerSelected": "ui-icon-minus" },
            });
            /* end jquery ui init */

            /* begin menu event */
            $("li").click(function () {
                var url = $(this).attr("title");
                if (url == null) url = "";
                $("#mainFrame").attr("src", url);
            });
            $("li").mouseover(function () {
                $(this).css("background-color", "#D2FCA0");
            });
            $("li").mouseout(function () {
                $(this).css("background-color", "#EFFEDD");
            });
            /* end menu event */
        });

        function menuClick(url) {
            $("#mainFrame").attr("src", url);
        }
	</script>
	<style type="text/css">
		html, body {
			width: 100%;
			height: 100%;
			padding: 0;
			margin: 0;
			overflow: hidden;
		}
		/* begin menu style */
		ul { background-color:#EFFEDD; }
        ul,li{
            margin:1px 1px 1px 1px;
            padding-left:0;
            list-style-type:none;
            cursor:pointer;
        }
        img { vertical-align:middle }
        hr{
            margin-top:1px; 
            margin-bottom:1px;
        }
        /* end menu style */
        
        /* begin jquery layout style */
		.layout {
			height: 100%;
			background-color:#dcdcdc;
			text-align: center;
		}
		.center {
			border: 1px solid #c8c8c8;
            display: inline-block;
		}
		.west {
			width: 18%;
			border: 1px solid #c8c8c8;
		}
		.north {
			height: 15%;
		}
		.south {
			height: 5%;
		}
		/* end jquery layout style */
		
		/* navigation style */
		.navigation {
		    height:20px;
		    width:100%; 
		    background-color:Gray;
		    font-size:12px;
		}
		/* separate style */
		.separate {
		    height:100%;
		    width:10px;
		    position:absolute;
		    left:0px;
		    top:0px; 
		    background-color:#ffffff;
		}
		/* main style */
		.main {
		    height:100%;
		    width:100%;
		    position:absolute;
		    left:10px;
		    top:20px;
		}
	</style>
</head>
<body>
    <form id="form1" runat="server" style="height:100%">
        <div id="test" data-layout='{"type": "border", "hgap": 0, "vgap": 0}' class="layout">
			<div class="center">
                <div class="navigation">
                </div>
                <div class="separate">
                    <a id="switchwest" href="javascript:void(0);" >
                        <img src="Image/frame/arrow-1.gif" alt='展开左侧菜单' border="0" style="padding:200px 0px 300px 0px" /></a>
                </div>
				<div class="main">
                    <iframe id="mainFrame" src="" name="ifrm" width="100%" height="100%"></iframe>
                </div>
			</div>
			<div class="west" >
                <div style="height:30px; line-height:30px; background:url(Image/frame/left-top.png) repeat-x">
                    <span style="font-size:16px;">操 作 菜 单</span>
                </div>
                <div style="overflow-y:scroll;overflow-x:hidden;height:97%; background-color:Gray;">
                    <div id="accordion">
                        <asp:Literal ID="ltMenu" runat="server"></asp:Literal>
                    </div>
                </div>
			</div>
			<div class="north">
				North
			</div>
			<div class="south">
				版权所有：2013-1-1至2014-1-1
			</div>
		</div>
    </form>
</body>
</html>
